<!DOCTYPE>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>请假</title>
    <link rel="stylesheet" href="/static/lib/layui/css/layui.css" media="all">
    <link rel="stylesheet" type="text/css" href="/static/plugin/layer/skin/layer.css">
    <link rel="stylesheet" type="text/css" href="/static/css/dj-css.css">
    <link rel="stylesheet" type="text/css" href="../../../page/common/css/oa_system.css">

</head>
<body>
<div id="createApp">

    <h2>填写申请</h2>
    <div class="main">
        <form class="layui-form layui-form-pane clearfix" action="">
            <div class="layui-form-item fl">
                <div class="dj-select dj-select-inline type">
                    <label>请假类型：</label>
                    <div class="dj-select-content">
                        <div class="dj-select-input" flag='true'>
                            <span class="dj-selected readOnly" type="text" name="" selectedCode=''
                                  style="height:40px;line-height:40px;" id="leave_type">请选择请假类型</span>
                            <i></i>
                        </div>
                        <ul class="dj-select-list">
                            <li code=0>事假</li>
                            <li code=1>病假</li>
                            <li code=2>婚假</li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="layui-form-pane fl time">
                <div class="layui-form-item">
                    <label class="layui-form-label">开始时间：</label>
                    <div class="layui-input-inline">
                        <input class="layui-input" placeholder="开始时间" id="LAY_demorange_s">
                        <i class="layui-icon">&#xe637;</i>
                    </div>
                    <label class="layui-form-label">结束时间：</label>
                    <div class="layui-input-inline">
                        <input class="layui-input" placeholder="结束时间" id="LAY_demorange_e">
                        <i class="layui-icon">&#xe637;</i>
                    </div>
                </div>
            </div>
        </form>
        <h4>请假原因：</h4>
        <textarea name="" id="reason" cols="30" rows="10" placeholder="请假理由必填~"></textarea>
        <div class="layui-form-item operate">

            <button class="layui-btn submit" lay-submit="" lay-filter="demo2" @click="sub">提交申请</button>
            <button class="layui-btn reset" @click="reset">重置</button>
        </div>
    </div>
</div>
<script src="/static/lib/jquery.min.js"></script>
<script src="/static/lib/layui/layui.js" charset="utf-8"></script>
<script src="/static/lib/vue.min.js"></script>
<script src="/static/lib/x-layui.js"></script>
<script src="/static/lib/dj-js.js"></script>
<script type="text/javascript">


    var myid = "${department.id}"
    if (myid == "") {
        var kid = ""
    } else {
        kid = "$!{department.id}"
    }
    var VM = new Vue({
        el: "#createApp",
        created: function () {
//            this.lay();
//            this.getDeptList();
        },
        data: {

            parameter: {
                "leave_type":"",
                "start_time":'',
                "end_time":"",
                "reason":""
            }
        },
        methods: {
            lay: function () {
                layui.use(['layer', "form", 'laydate'], function () {
                    var form = layui.form(),
                            layer = layui.layer,
                            laydate = layui.laydate;
                    form.on('checkbox(allChoose)', function (data) {
                        var child = $(data.elem).parents('table').find('tbody input.checkbox');
                        child.each(function (index, item) {
                            item.checked = data.elem.checked;
                        });
                        form.render('checkbox');
                    });

                });
            },
            verify: function (item) {
                if (item == "") {
                    layer.msg("必填项不能为空！", {icon: 5});
                    return false;
                }
            },
            sub: function () {
                var _this = this;
                layui.use(['layer', "form", 'laydate'], function () {
                    var layer = layui.layer;
                });
                this.parameter.leave_type = $("#leave_type").html();
                this.parameter.start_time = $("#LAY_demorange_s").val();
                this.parameter.end_time = $("#LAY_demorange_e").val();
                this.parameter.reason = $("#reason").val();
                $.ajax({
                    type: "post",
                    url: "../../activiti/startleave.do",
                    data: _this.parameter,
                    dataType: "json",
                    success: function (data) {
                        layer.msg("提交成功！", {icon: 1});
//                        var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
//                        parent.layer.close(index);
//                        parent.window.location.reload();
//                        window.location.href = "javascript:location.replace(location.href)";
                    }
                });
            },
            reset:function () {
                $("#leave_type").html("请选择请假类型");
                $("#leave_type").attr("selectedCode","");
                $(".dj-select-list li").removeClass("selected");
                $("#LAY_demorange_s").val("");
                $("#LAY_demorange_e").val("");
                $("#reason").val("");
            }
        }
    });//vue 实例结束

    layui.use('laydate', function () {
        var laydate = layui.laydate;
        $("#LAY_demorange_s").val(laydate.now());
        $("#LAY_demorange_e").val(laydate.now());
        var start = {
            max: '2099-06-16 23:59:59'
            , istoday: false
            , choose: function (datas) {
                end.min = datas; //开始日选好后，重置结束日的最小日期
                end.start = datas;//将结束日的初始值设定为开始日
            }
        };

        var end = {
            max: '2099-06-16 23:59:59'
            , istoday: false
            , choose: function (datas) {
                start.max = datas; //结束日选好后，重置开始日的最大日期
            }
        };

        document.getElementById('LAY_demorange_s').onclick = function () {
            start.elem = this;
            laydate(start);
        };
        document.getElementById('LAY_demorange_e').onclick = function () {
            end.elem = this;
            laydate(end);
        }

    });

</script>
</body>
</html>